<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <title>注册成为新用户 || bookshop</title>
    <meta name="description" content="">
    <meta name="keywords" content="">
    <link rel="shortcut icon" href="/image/icon/litIcon.ico">
    <link href="/css/newUser.css" rel="stylesheet">
    <link href="/css/reset.css" rel="stylesheet">
    <script src="/js/jquey-1.8.0.min.js" type="text/javascript"></script>
</head>

<body>
<!-- 注册页面头部 -->
<div class="register_wrap">
    <div class="register_content register_content2 clear">
        <div class="register_operate" id="__ddnav_menu">
            <p id="nickname">欢迎光临便民购，请
                <a name="ddnav_login" href="/agricultural/login" target="_self" class="login_link">登录</a>
                <a name="ddnav_register" href="/agricultural/register" target="_self" class="login_link">免费注册</a>
            </p>
        </div>
        <div class="register_logo"></div>
        <div class="banner clear">
            <div class="bannerHeader fr sprite"></div>
        </div>

    </div>
    <!--  <div class="registerhead_bottom"></div> -->
</div>
<!-- /注册页面头部 -->
<!-- 注册页面主体 -->
<div class="registerMian">
    <form action="/agricultural/success" method="post" id="register_form" name="form">
        <div id="bd">
            <div class="register_box">

                <div class="head">
                    <a tabindex="11" class="more" name="help" href="">注册帮助</a>
                    <p class="coupon_words">
                        <label>完成手机/邮箱验证注册，可以选商品实现购物！ </label>
                    </p>
                    <h3> 注册新用户</h3>
                </div>
                <!-- =================================================================== -->
                <div class="body">
                    <table width="100%" cellspacing="0" cellpadding="0" border="0">
                        <tbody>
                        <!-- 邮箱/手机号码: -->
                        <tr>
                            <td class="t">
                                邮箱/手机号码：
                            </td>
                            <td class="z_index2">
                                <!-- onfocus="check_username_focus()"  -->
                                <input type="text" tabindex="1" maxlength="40" value="15295993728"
                                       autocomplete="off" class="text" name="username" id="txt_username"
                                       style="border-color: rgb(127, 157, 185);">
                                <span class="icon_yes" style="display: none;" id="spn_username_ok"></span>
                                <span class="warn" style="display: none;" id="spn_username_wrong"></span>
                            </td>
                        </tr>

                        <!-- 登录密码: -->
                        <tr>
                            <td class="t">
                                登录密码：
                            </td>
                            <td id="in_password">
                                <!-- onblur="password_check()" onkeyup="txtPassword_strong_check()"
                                       onfocus="check_password_focus()"  -->
                                <input type="password" tabindex="2" value="123456"
                                       class="text" name="password" id="txt_password">
                                <span class="warn" style="display: none;" id="password_info"></span>
                            </td>
                        </tr>

                        <!-- 确认密码: -->
                        <tr>
                            <td class="t">
                                确认密码：
                            </td>
                            <td id="in_rePassword">
                                <!-- onkeydown="CheckdoSubmit(event)" onkeyup="repassword_session_check()"
                                       onblur="repassword_check()" onfocus="check_repassword_focus()" -->
                                <input type="password" tabindex="3" class="text" value="123456"
                                       name="rePassword" id="txt_rePassword">
                                <span class="warn" style="display: none;" id="rePassword_info"></span>
                            </td>
                        </tr>

                        <!-- 邮寄地址: -->
                        <tr id="tb_tr_reg_vcode">
                            <td class="t">
                                邮寄地址：
                            </td>
                            <td>
                                <!--  -->
                                <input type="text" maxlength="20" autocomplete="off" class="text" name="address"
                                       id="txt_vcode" value="广西">
                                <span class="warn" style="display: none;" id="address_info"></span>
                            </td>
                        </tr>

                        <!-- 用户姓名: -->
                        <tr>
                            <td class="t">
                                用户姓名：
                            </td>
                            <!-- onkeydown="CheckdoSubmit(event)" onkeyup="repassword_session_check()"
                                       onblur="repassword_check()" onfocus="check_repassword_focus()" -->
                            <td id="in_realname">
                                <input type="text" tabindex="3" value="文龙"
                                       class="text" name="realname" id="realname">
                                <span class="warn" style="display: none;" id="realname_info"></span>
                            </td>
                        </tr>

                        <!-- 立刻注册: -->
                        <tr>
                            <td class="t">&nbsp;
                            </td>
                            <td>
                                <!-- onclick="check_register();" -->
                                <input type="submit" tabindex="7" value="立刻注册" title="注册"
                                       class="btn_login" name="g" id="btn_register">
                            </td>
                        </tr>

                        <!-- 同意条款: -->
                        <tr>
                            <td class="t">&nbsp;
                            </td>
                            <td class="clause">
                                        <span class="float_l">
                                        <input type="checkbox" tabindex="8" onclick="agreeement_check()"
                                               onmouseover="this.style.cursor='pointer';this.style.cursor='hand';"
                                               checked="checked" name="chb_agreement" id="chb_agreement">我已阅读并同意<a
                                                tabindex="9" target="_blank"
                                                href=" http://help.dangdang.com/details/page12">《便民购交易条款》</a>和<a
                                                tabindex="10" target="_blank"
                                                href="http://help.dangdang.com/details/page42">《便民购社区条款》</a></span>
                                <span style="display: none" class="cue" id="spn_agreement_wrong"></span>
                                <span style="display: none" class="cue" id="spn_err_msg"></span>
                            </td>
                        </tr>

                        </tbody>
                    </table>
                </div>
            </div>
        </div>
        <script type="text/javascript">
            $(function () {
                // username
                $("#txt_username").focus(function () {
                    // check_focus('#txt_username', '#spn_username_ok', '#spn_username_wrong');
                    if ($('#spn_username_wrong').text()) return;
                    $('#spn_username_wrong').text(msg[0]).css({
                        display: 'inline',
                        color: '#9e9e9e'
                    });
                    $("#spn_username_ok").hide()
                })
                    .blur(function () {
                        var pattEmail = /^([a-z0-9_\.-]+)@([\da-z\.-]+)\.([a-z\.]{2,6})$/;
                        var pattPhone = /^[0-9]{11}$/;
                        var username = $(this).val();

                        if (!(pattEmail.test(username) || pattPhone.test(username))) {
                            // alert("邮箱或电话号码不符合格式")
                            $("#spn_username_wrong").css({
                                display: 'inline',
                                color: 'red'
                            }).text('邮箱或电话号码不符合格式');
                            $("#spn_username_ok").hide()
                        } else {
                            $.ajax({
                                url: '/agricultural/getVailUsername',
                                data: 'username=' + username,
                                type: 'GET',
                                success(reData) {
                                    if (reData.code == 300) {
                                        $("#spn_username_wrong").css({
                                            display: 'inline',
                                            color: 'red'
                                        }).text(reData.message);
                                        $("#spn_username_ok").hide()
                                        $("#txt_username").attr('sub', 'false')
                                    } else {
                                        $("#spn_username_wrong").hide();
                                        $("#spn_username_ok").css({
                                            display: 'inline',
                                            color: 'green'
                                        }).text('邮箱或电话号码符合格式');
                                        $("#txt_username").attr('sub', 'true')
                                    }
                                }
                            });
                        }
                    });
                // password & rePassword
                $("#txt_password").blur(function () {
                    var password = $(this).val();
                    var pattPassword = /^[a-z0-9_-]{6,18}$/;
                    if (!(pattPassword.test(password))) {
                        $("#password_info").css({
                            display: 'inline',
                            color: 'red'
                        }).text('输入6-18位字符数字下划线密码')
                    } else {
                        $("#password_info").css({
                            display: 'inline',
                            color: 'green'
                        }).text('密码符合要求')
                    }
                });
                $("#txt_rePassword").blur(function () {
                    var password = $("#txt_password").val();
                    var repassword = $(this).val();
                    if (password !== repassword) {
                        $("#rePassword_info").css({
                            display: 'inline',
                            color: 'red'
                        }).text('两次密码不一致')
                    } else {
                        $("#rePassword_info").css({
                            display: 'inline',
                            color: 'green'
                        }).text('两次密码一致')
                    }
                });
                // address
                $("#txt_vcode").blur(function () {
                    var address = $(this).val().trim();
                    if (address === '') {
                        $("#address_info").css({
                            display: 'inline',
                            color: 'red'
                        }).text('请输入地址')
                    } else {
                        $("#address_info").hide()
                    }
                });
                // realname
                $("#realname").blur(function () {
                    var realname = $(this).val().trim();
                    var patt = /^[\u4e00-\u9fa5]{1,10}/;
                    if (!(patt.test(realname))) {
                        $("#realname_info").css({
                            display: 'inline',
                            color: 'red'
                        }).text('请输入真实姓名')
                    } else {
                        $("#realname_info").hide()
                    }
                });
                // submit
                $(".btn_login").click(function (event) {
                    /* $("#txt_username").attr("sub") === undefined */
                    if ($("#txt_username").val().trim() === '' || $("#txt_username").attr("sub") === 'false') {
                        $("#txt_username").focus();
                        event.preventDefault();
                        return
                    }
                    if ($("#txt_password").val().trim() === '') {
                        $("#txt_password").focus();
                        event.preventDefault();
                        return
                    }
                    if ($("#txt_rePassword").val().trim() === '') {
                        $("#txt_rePassword").focus();
                        event.preventDefault();
                        return
                    }
                    if ($("#txt_vcode").val().trim() === '') {
                        $("#txt_vcode").focus();
                        event.preventDefault();
                        return
                    }
                    if ($("#realname").val().trim() === '') {
                        $("#realname").focus();
                        event.preventDefault();
                        return
                    }

                    var data = $("#register_form").serialize();
                    event.preventDefault();

                    $.ajax({
                        type: "POST",
                        url: "/agricultural/success",
                        data,
                        success(msg) {
                            if (msg.code == 200) {
                                alert(msg.message);
                                location.href = 'http://localhost:8080/agricultural/login'
                            } else if (msg.code == 300) {
                                alert(msg.message)
                            }
                        }
                    });
                });
            })
        </script>
        <div style="display:none" class="register_pop" id="div_identity_verification">
            <div class="close">
            </div>
            <div class="head">
                <h3>验证身份</h3>
            </div>
            <div class="body">
                <dl>
                    <p style="margin-left: 20px;color:red; height: 50px;" id="temp_mind">
                        由于近期运营商调整了短信发送规则,可能造成信息发送延迟.如果您长时间未收到验证短信,请尝试重新发送</p>
                    <dt>手机号码：</dt>
                    <dd>
                        <b id="b_pop_mobliephone"></b><span class="btn_time" id="jishi">24秒后重新获取</span><a
                            style="display: none;" class="btn_go_buy" id="ajishi" href="#">重新获取验证码</a>
                        <p class="hint" id="p_pop_mobliephone_ok">
                            验证码已经发送到您的手机上</p>
                        <p><span class="cue" style="display: none;" id="p_pop_mobliephone_wrong">
                            </span></p>
                    </dd>
                    <dt>验证码：</dt>
                    <dd>
                        <input type="text" maxlength="6" onblur="pop_sms_vcode_check()"
                               onfocus="check_pop_sms_vcode_focus()" onkeydown="CheckdoPopSubmit(event)" value=""
                               class="text" autocomplete="off" name="txt_pop_sms_vcode" id="txt_pop_sms_vcode"><span
                            style="display: none" id="spn_pop_sms_vcode_ok"></span>
                        <p><span class="hint" id="p_pop_sms_vcode_wrong">
                            </span></p>
                    </dd>
                    <dt style="display: none;" id="dt_mp_vcode">图形验证码：</dt>
                    <dd style="display: none;" id="dd_mp_vcode">
                        <input type="text" maxlength="4" onkeydown="CheckdoPopSubmit(event)" onblur="pop_vcode_check()"
                               onfocus="check_pop_vcode_focus()" autocomplete="off" value="" class="text"
                               name="txt_pop_vcode" id="txt_pop_vcode"><span style="display: none;" class=""
                                                                             id="spn_pop_vcode_ok"></span>
                        <p><span style="display: none;" class="cue" id="p_pop_vcode_wrong">
                        </span></p>
                    </dd>
                    <dt>&nbsp;</dt>
                    <dd>
                        <input type="button" onclick="pop_mobilephone_check()" class="btn_enter">
                    </dd>
                    <input type="submit" style="display: none;" name="btn_pop_submit" id="btn_pop_submit">
                </dl>
            </div>
        </div>
        <div style="display: none; height: 728px;" class="mask" id="div_mask_cover">
        </div>
    </form>
</div>
<!-- /注册页面主体 -->
<div id="footer" class="padb10">
    <p class="padt10 textc cor2 lh20">
        <a class="disin padlr10" href="" target="_blank">便民购在线</a>
        <a class="disin padlr10" href="" target="_blank">当当网</a>
        <a class="disin padlr10" href="" target="_blank">亚马逊</a>
        <span class="dinin padlr20">|</span>
        <a class="disin padlr10" href="">微博微信</a>
        <a class="disin padlr10" href="">天猫旗舰店</a>
        <a class="disin padlr10" href="" target="_blank">极客学院</a>
        <a class="disin padlr10" href="" target="_blank">桂林理工大学</a>
        <a class="disin padlr10" href="" target="_blank">电子商务</a>
    </p>
</div>
<script src="/js/jquey-1.8.0.min.js" type="text/javascript"></script>
<script src="/js/register.js" type="text/javascript"></script>
<script src="/js/check_browser.js" type="text/javascript"></script>
</body>

</html>
